<!doctype html>
<html lang="zh">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> 
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>ZHLBLOG登陆页面</title>

<link rel="stylesheet" type="text/css" href="__TMPL__Public/login/styles.css">
<script src="__TMPL__Public/js/jquery.js"></script>
<style type="text/css">
body,td,th { font-family: "Source Sans Pro", sans-serif; }
body { background-color: #2B2B2B; }
</style>
</head>
<body>


<div class="wrapper">

	<div class="container">
		<h1>ZHLBLOG</h1>
		<form action="{:U('user/login/dologin_changyan')}" method="post">
			<input type="text" placeholder="Username" name="username" >
			<input type="password" placeholder="Password"  name="password">
			<input type="text" id="input_verify" name="verify"  placeholder="验证码" >
			{:sp_verifycode_img('length=4&font_size=18&width=250&height=44&charset=2345678&use_noise=1&use_curve=0')}<br/>
			<button type="submit" id="login-button">Login</button><br/><br/>
			<a href="/api/changyan/login/type/qq.html" style="text-decoration: blink;">
				<img src="/themes/zhlblog/Public/images/qq.png" alt="QQ登录" style="width: 30px;  height: 30px; border-radius: 13px;"> 
			</a>&nbsp;
			<a href="/api/changyan/login/type/sina.html" style="text-decoration: blink;">
				<img src="/themes/zhlblog/Public/images/weibo.png" alt="微博登录" style="width: 30px;  height: 30px; border-radius: 13px;"> 
				</a>
		</form>
	</div>
	
	<ul class="bg-bubbles">
		<li></li>
		<li></li>
		<li></li>
		<li></li>
		<li></li>
		<li></li>
		<li></li>
		<li></li>
		<li></li>
		<li></li>
	</ul>
	
</div>

<script type="text/javascript" src="js/jquery-2.1.1.min.js"></script>
<script type="text/javascript">
$('#login-button').click(function(event){
	
	$('form').fadeOut(500);
	$('.wrapper').addClass('form-success');
});
</script>

</body>
</html>